// 封装axios请求函数
import axios from 'axios'
import { Toast } from 'vant' // 引入Vant组件库
import router from '../router' // 引入路由文件

// 判断当前的运行环境 process.env.NODE_ENV
// isDev 为真 开发环境 --- npm run serve
// isDev 为假 非开发环境（测试环境，生产环境）- npm run build
const isDev = process.env.NODE_ENV === 'development'

const request = axios.create({
  // 根据环境 设置不同的baseURL
  // 配置了前端反向代理,直接'/api'代理了本地数据的请求接口,后边跟的是线上的接口地址,当isDev为true时就代表了上线了,用的就是后百年的请求接口了
  baseURL: isDev ? '/api' : 'http://www.tfyhyc.cn'
})

// 请求拦截器 - 所有的请求开始之前先到此处
request.interceptors.request.use((config) => {
  // 可以设置 加载的动画效果 的展示
  // 在必要的路由设置一些额外的参数 ---- token信息携带放在此处
  // 将token放到请求头中发送给服务器
  const token = localStorage.getItem('lazypigtoken')
  if (token) {
    // 请求头携带token
    config.headers.token = token
  }
  console.log('正在加载....')
  return config
}, (error) => {
  return Promise.reject(error)
})

// 响应拦截器 --- 所有请求的相应先到此处
request.interceptors.response.use((response) => {
  // 可以设置加载的动画效果的隐藏
  console.log('加载完毕')
  return response
}, (error) => {
  console.log('请求错误')
  console.log('errcode', error.response.data.msg)
  // 注意,因为我这个项目token错误的话控制台会报错,所以是写到error响应失败的区域中,若是不会报错的话则可以写到响应成功response区域中
  // 对错误token进行验证
  // 解构状态码
  const errcode = error.response.data.msg * 1
  // 然后进行token的验证
  // token的验证主要是根据前端请求的时候携带的token进行数据请求的时候,返回的状态码来判断
  // 4600: 没有携带token值; 4601: token失效,请重新登录; 4602: token错误
  if (errcode === 4600 || errcode === 4601 || errcode === 4602) {
    console.log('token错误')
    Toast('登录状态失效,即将跳转至登录页面')
    // 跳转到登录页面
    setTimeout(() => {
      router.replace('/loginAndregister')
    }, 3000)
  }
  return Promise.reject(error)
})
// 以request暴露出去
export default request
